<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <title th:text="${lic.company} + ' - 系统安装 - 配置数据库连接'"></title>
  <link rel="stylesheet" type="text/css" th:href="@{/skin/common.css}">
  <!-- 注意不能用SkinMgr.getSkin(request)，因为如果数据库连接出错，其中调用到数据库的地方就会出错 -->
  <link type="text/css" rel="stylesheet" th:href="@{/skin/lte/css.css}" />
  <link rel="stylesheet" th:href="@{/js/layui/css/layui.css}" media="all">
  <style type="text/css">
    td {
      height: 34px;
    }
    input:not([type="radio"]):not([type="button"]):not([type="checkbox"]) {
      width: 200px;
    }
  </style>
  <script th:src="@{/inc/common.js}"></script>
  <script th:src="@{/js/jquery-3.7.1.min.js}"></script>
  <link th:href="@{/js/jquery-alerts/jquery.alerts.css}" rel="stylesheet" type="text/css" media="screen"/>
  <script th:src="@{/js/jquery-alerts/jquery.alerts.js}" type="text/javascript"></script>
  <script th:src="@{/js/jquery-alerts/cws.alerts.js}" type="text/javascript"></script>
  <link th:href="@{/js/jquery-showLoading/showLoading.css}" rel="stylesheet" media="screen"/>
  <script th:src="@{/js/jquery-showLoading/jquery.showLoading.js}" type="text/javascript"></script>
  <script th:src="@{/js/jquery.toaster.js}" type="text/javascript"></script>
</head>
<body>
<table cellpadding="6" cellspacing="0" border="0" width="100%">
  <tr>
    <td width="1%" valign="top"></td>
    <td width="99%" align="center" valign="top">
      <div align="left"><b>欢迎您使用<span th:text="${lic.company}"></span>系统&nbsp;<span th:text="${oaVersion}"></span> PostgreSQL版本</b></div>
      <hr size="0">
      <form id="form1" action="?op=setup" method=post>
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td height="24" colspan="2" align="left">配置数据库连接：</td>
          </tr>
          <tr>
            <td height="24" align="right">&nbsp;</td>
            <td>
              <span id="info"></span>
            </td>
          </tr>
          <tr>
            <td height="24" align="right">配置文件路径：</td>
            <td>
              <span th:text="${path}"></span>
              <br/>(在初始化前，请先将redmoonoa.sql导入mysql数据库)</td>
          </tr>
          <tr>
            <td height="24" align="right">用户名：</td>
            <td><input name="user" th:value="${user}"/></td>
          </tr>
          <tr>
            <td height="24" align="right">密码：</td>
            <td><input type="password" name="pwd" th:value="${pwd}"/></td>
          </tr>
          <tr>
            <td height="24" align="right"><span class="thead" style="PADDING-LEFT: 10px">主机名：</span></td>
            <td><input name="ip" th:value="${ip}"/></td>
          </tr>
          <tr>
            <td height="24" align="right"><span class="thead" style="PADDING-LEFT: 10px">端口号：</span></td>
            <td><input name="port" th:value="${port}" size="8"/></td>
          </tr>
          <tr>
            <td height="24" align="right"><span class="thead" style="PADDING-LEFT: 10px">数据库名：</span></td>
            <td><input id="database" name="database" th:value="${database}"/></td>
          </tr>
          <tr>
            <td height="24" align="right">最大连接数：</td>
            <td><input type="text" name="maximum_connection_count" th:value="${maximumConnectionCount}"/></td>
          </tr>
        </table>
      </form>
      <hr size="0">
      <div align="center">
        <input class="btn" type="button" onclick="window.location.href='index'" value="上一步"/>
        &nbsp;&nbsp;&nbsp;&nbsp;
        <input id="btnConn" class="btn" type="button" value="连接测试">
        &nbsp;&nbsp;&nbsp;&nbsp;
        <input class="btn" type="button" onclick="window.location.href='setup3?db_type=mysql'" value="下一步"/>
      </div>
    </td>
  </tr>
</table>
</body>
<script th:inline="javascript">
  $(function() {
    $('#btnConn').click(function() {
      setupDbProp();
    });
  });

  function setupDbProp() {
    $.ajax({
      url: "setupDbProp",
      type: "post",
      dataType: "json",
      data: $('#form1').serialize(),
      beforeSend: function (XMLHttpRequest) {
        $('body').showLoading();
      },
      success: function (data, status) {
        $('body').hideLoading();
        if (data.ret == 1) {
          refreshDruid();
        }
      },
      error: function (XMLHttpRequest, textStatus) {
        $('body').hideLoading();
        alert(XMLHttpRequest.responseText);
      }
    });
  }

  function refreshDruid() {
    $.ajax({
      async: false,
      type: "post",
      url: "management/refresh",
      data: {},
      dataType: "json",
      beforeSend: function (XMLHttpRequest) {
        $('body').showLoading();
      },
      complete: function (XMLHttpRequest, status) {
      },
      success: function (data, status) {
        $('body').hideLoading();
        // 返回为[]或["spring.datasource.url"]或["spring.datasource.maxActive","spring.datasource.url"]
        // consoleLog(data);
        checkPool();
      },
      error: function (XMLHttpRequest, textStatus) {
        $('body').hideLoading();
        alert(XMLHttpRequest.responseText);
      }
    });
  }

  function checkPool() {
    $.toaster({priority: 'info', message: '参数设置成功，开始连接测试'});

    $.ajax({
      async: false,
      type: "post",
      url: "checkPool",
      data: {
        database: $('#database').val()
      },
      dataType: "json",
      beforeSend: function (XMLHttpRequest) {
      },
      complete: function (XMLHttpRequest, status) {
      },
      success: function (data, status) {
        if (data.ret == 1) {
          $('#info').html('<span style="color:green"><b>测试连接成功，缓存已清除！</b></span>');
        } else {
          $('#info').html('<span style="color:red"><b>测试连接失败！请检查连接字符串、用户名和密码是否正确！</b></span>');
        }
      },
      error: function (XMLHttpRequest, textStatus) {
        alert(XMLHttpRequest.responseText);
      }
    });
  }
</script>
</html>